<script setup>
import router from "@/router/index.js";
import {getDocProcessingPageList} from "@/api/document/processDocument.js";

const loading = ref(false)
const data = reactive({
  queryParams: {
    status: '',
  }
})
const {queryParams} = toRefs(data)
const documentStatisticsList = ref([])

onMounted(() => {
  getList()
})

function getList() {
  loading.value = true
  getDocProcessingPageList().then(res => {
    loading.value = false
    documentStatisticsList.value.push({ label: '待办', value: '待办', count: res.list.length })
  })
}

function turnToDocument() {
  router.push({ path: '/document/process', query: { docStatus: '待办' } })
}

</script>

<template>
  <el-card shadow="never">
    <el-row class="mb20">
      <el-col :span="24" style="text-align: left">
        <el-text style="font-size: 16px;" type="primary" link>办理公文</el-text>
      </el-col>
    </el-row>

    <el-row>
      <el-col :span="24" v-for='item in documentStatisticsList' :key="item.value">
        <el-badge :value="item.count" :max="99">
          <el-button plain @click="turnToDocument()">{{item.label}}</el-button>
        </el-badge>
      </el-col>
    </el-row>

  </el-card>
</template>